/**index.scss**/
.monitor-page-container {
  background-color: #f6f6f6;
  padding-bottom: 184rpx;

  .menu {
    position: relative;
    border-top: 1rpx solid #f6f6f6;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding-right: 20rpx;
    background-color: white;
    border-bottom: 1rpx solid #f6f6f6;

    .menu-item {
      --td-dropdown-menu-icon-sizem: 30rpx;
      --td-dropdown-menu-colorm: #86909C;
      --td-dropdown-menu-active-colorm: #3375F5;
      --td-dropdown-menu-border-width: 0;
    }

    .date-selector {
      margin-left: 45rpx;
      width: 178rpx;
      flex-shrink: 0;
      color: #86909C;

      .t-icon {
        color: #86909C;
      }

      .active {
        color: var(--td-brand-color);

        .t-icon {
          color: var(--td-brand-color);
        }
      }
    }

    .search-placeholder {
      width: 144rpx;
      height: 100%;

    }

    .company-search {
      // background-color: aqua;
      width: 144rpx;
      height: 100%;
      padding-top: 2px;
      box-sizing: border-box;
      overflow: hidden;
      transition: width 0.2s;
      font-size: 26rpx;
      color: #86909C;
      position: absolute;
      top: 0;
      right: 20rpx;

      .fold {
        display: none;
      }

      &.input-is-focus {
        width: 730rpx;
        padding-left: 20rpx;

        .fold {
          display: inline-block;
          flex-shrink: 0;
          padding-left: 20rpx;
        }
      }

      .search-input {
        flex: 1;
        --td-search-clear-icon-font-size: 28rpx;
        --td-search-font-size: 24rpx;
        --td-search-icon-font-size: 34rpx;
        --td-search-height: 30px;
        --td-search-padding: 16rpx;
      }
    }
  }
}

.index-page {
  box-sizing: border-box;
  flex: 1;
  overflow: hidden;
}

.loading-container {
  padding: 4px 0;
  text-align: center;
  color: #86858B;
}

.slot-header-custom {
  border-top: 1px solid #E4E4E4;
  width: 690rpx;
  padding: 30rpx 30rpx 50rpx 30rpx;

  .labels {
    padding-bottom: 4px;

    .name {
      width: 280rpx;
      line-height: 20px;
    }
  }

  .values {
    .value {
      width: 280rpx;
      height: 76rpx;
      background-color: #F3F3F3;
      border-radius: 4px;
      flex-wrap: nowrap;
      box-sizing: border-box;
      padding: 0 20rpx;

      &.active {
        border: 1px solid #165DFF;
      }
    }
  }
}

.slot-footer-custom {
  width: 690rpx;
  padding: 30rpx;

  .t-button {
    width: 330rpx;
  }
}

// .search-container{
//   position: relative;
//     width: 750rpx;
//     height: 42px;
//     background-color: #fff;
//     flex-shrink: 0;
//     flex-basis: content;
//     border-bottom: 1px solid #EDEFF3;
//     padding: 0 30rpx;
//     box-sizing: border-box;
//     align-items: center;
//     .search-item{
//       height: 100%;
//       color: #86909C;
//       font-size: 28rpx;
//       line-height: 42px;
//       &.is-active{
//         color: var(--td-brand-color);
//         .t-icon-custom{
//           color: var(--td-brand-color)!important;
//         }
//       }
//     }
//     .search-placeholder{
//       width: 144rpx;
//       height: 100%;
//     }
//     .company-search{
//       width: 144rpx;
//       height: 100%;
//       padding-top: 2px;
//       box-sizing: border-box;
//       overflow: hidden;
//       transition: width 0.2s;
//       font-size: 26rpx;
//       color: #86909C;
//       position: absolute;
//       top: 0;
//       right: 30rpx;
//       .fold{
//         display: none;
//       }
//       &.input-is-focus{
//         width: 720rpx;
//         padding-left: 24rpx;
//         .fold{
//           display: inline-block;
//           flex-shrink: 0;
//           padding-left: 20rpx;
//         }
//       }
//       .search-input{
//         flex: 1;
//         --td-search-clear-icon-font-size: 28rpx;
//         --td-search-font-size: 28rpx;
//         --td-search-icon-font-size: 36rpx;
//         --td-search-height: 30px;
//         --td-search-padding: 16rpx;
//       }
//     }
// }